<div class="alarm-list alarm-flex">
  <header class="alarm-main-header">
    <span (click)=onClickHeader(2) [ngClass]="{on:active==2}">
      风机状态
    </span>
    <span (click)=onClickHeader(0) [ngClass]="{on:active==0}">
      实时报警
    </span>
    <span (click)=onClickHeader(1) [ngClass]="{on:active==1}">
      历史报警
    </span>
  </header>
  <section class="alarm-full alarm-main-content" #alarmTable *ngIf="active==0">
    <p-table [value]="alarmList" [paginator]="true" [rows]="8" [showCurrentPageReport]="true" [resizableColumns]="true" [(first)]="first" currentPageReportTemplate="共 {{alarmList.length}} 记录">
      <ng-template pTemplate="header" let-columns>
        <tr class="data-columns">
          <!--<th style="width:15%;text-align: left" pResizableColumn>点名</th>-->
          <th style="width:15%;text-align: left" pResizableColumn>描述</th>
          <th style="width:10%;text-align: left" pResizableColumn>一级系统</th>
          <th style="width:10%;text-align: left" pResizableColumn>二级系统</th>
          <th style="width:10%;text-align: left" pResizableColumn>三级系统</th>
          <th style="width:8%;text-align: left" pResizableColumn>内容</th>
          <th style="width:5%;text-align: left" pResizableColumn>值</th>
          <th style="width:12%;text-align: left" pResizableColumn>开始时间</th>
        </tr>
      </ng-template>
      <ng-template pTemplate="body" let-row let-columns="columns">
        <tr class="data-rows">
          <!--<td class="ui-resizable-column">{{row.GN}}</td>-->
          <td class="ui-resizable-column">{{row.faultDesc}}</td>
          <td class="ui-resizable-column">{{row.firstModule}}</td>
          <td class="ui-resizable-column">{{row.secondModule}}</td>
          <td class="ui-resizable-column">{{row.thirdModule}}</td>
          <td class="ui-resizable-column">{{row.faultLevelName}}</td>
          <td class="ui-resizable-column">{{row.multipleValue}}</td>
          <td class="ui-resizable-column">{{row.faultBeginTime}}</td>
        </tr>
      </ng-template>
      <ng-template pTemplate="emptymessage" let-columns>
        <tr>
          <td style="text-align: center">
            没有数据
          </td>
        </tr>
      </ng-template>
    </p-table>
  </section>
  <!--报警统计  -->
  <section class="alarm-main-content alarm-full" *ngIf="active==1">
    <p-table [value]="aalarmList" [paginator]="true" [rows]="8" [showCurrentPageReport]="true" [resizableColumns]="true" [(first)]="first"
             currentPageReportTemplate="共 {{aalarmList.length}} 记录">
      <ng-template pTemplate="header" let-columns>
        <tr class="data-columns">
          <!--<th style="width:15%;text-align: left" pResizableColumn>点名</th>-->
          <th style="width:15%;text-align: left" pResizableColumn>描述</th>
          <th style="width:10%;text-align: left" pResizableColumn>一级系统</th>
          <th style="width:10%;text-align: left" pResizableColumn>二级系统</th>
          <th style="width:10%;text-align: left" pResizableColumn>三级系统</th>
          <th style="width:8%;text-align: left" pResizableColumn>内容</th>
          <th style="width:5%;text-align: left" pResizableColumn>值</th>
          <th style="width:15%;text-align: left" pResizableColumn>开始时间</th>
          <th style="width:15%;text-align: left" pResizableColumn>结束时间</th>
        </tr>
      </ng-template>
      <ng-template pTemplate="body" let-row let-columns="columns">
        <tr class="data-rows">
          <!--<td class="ui-resizable-column">{{row.GN}}</td>-->
          <td class="ui-resizable-column">{{row.faultDesc}}</td>
          <td class="ui-resizable-column">{{row.firstModule}}</td>
          <td class="ui-resizable-column">{{row.secondModule}}</td>
          <td class="ui-resizable-column">{{row.thirdModule}}</td>
          <td class="ui-resizable-column">{{row.faultLevelName}}</td>
          <td class="ui-resizable-column">{{row.multipleValue}}</td>
          <td class="ui-resizable-column">{{row.faultBeginTime}}</td>
          <td class="ui-resizable-column">{{row.faultEndTime}}</td>
        </tr>
      </ng-template>
      <ng-template pTemplate="emptymessage" let-columns>
        <tr>
          <td style="text-align: center">
            没有数据
          </td>
        </tr>
      </ng-template>
    </p-table>
  </section>
  <!--  <section class="detail-flex detail-column">
          <header>风功率曲线</header>
          <section class="detail-flex-full">
            <div fxFlexFill echarts (chartInit)="onChartInit($event)" [options]="options">
            </div>
          </section>
        </section> -->
  <section class="alarm-main-content alarm-full" *ngIf="active==2">
    <section class="detail-flex-full scroll-wind-power">
      <p-table [value]="turbineStatuses" [paginator]="true" [rows]="8" [showCurrentPageReport]="true" [resizableColumns]="true" [(first)]="first"
               currentPageReportTemplate="共 {{turbineStatuses.length}} 记录">
        <ng-template pTemplate="header" let-columns>
          <tr class="data-columns">
            <th style="text-align: left" pResizableColumn>信息状态</th>
            <th style="text-align: left" pResizableColumn>时间</th>
          </tr>
        </ng-template>
        <ng-template pTemplate="body" let-row let-columns="columns">
          <tr class="data-rows">
            <td class="ui-resizable-column">{{row.statusName}}</td>
            <td class="ui-resizable-column">{{row.time}}</td>
          </tr>
        </ng-template>
        <ng-template pTemplate="emptymessage" let-columns>
          <tr>
            <td style="text-align: center">
              没有数据
            </td>
          </tr>
        </ng-template>
      </p-table>
    </section>
  </section>
</div>
